import { Table, Space, Button, Pagination, Modal } from 'antd';
import React, { useEffect } from 'react'; //引入
import { del, idget } from '../../services/admin';
import { ExclamationCircleOutlined } from '@ant-design/icons';
import { useSelector, useDispatch, } from 'react-redux';
import { isModalVisible, setAdmin, setStudent } from '../../store/slice/adminSlice';



const { Column } = Table;
const { confirm } = Modal;


export default function List({ pagination, show }) {


    let adminData = useSelector(state => state.admin.admins);

    const dispatch = useDispatch();
    // const [dataState, setDadaState] = useState("");

    // useEffect(() => {
    //     show();
    // }, [1]);//students.length

    const handleChange = ({ current, pageSize }) => {
        show({ current, pageSize });
    };

    const showModal = async (id) => {
        let res = await idget(id);
        console.log(res);
        dispatch(setStudent(res.data))
        dispatch(isModalVisible(true));
    };


    const handleDel = async (id) => {
        confirm({
            title: '是否确认删除?',
            icon: <ExclamationCircleOutlined />,
            content: '删除当前学生',
            async onOk() {
                await del(id);
                show();
            }
        });
    }

    return (
        <Table rowKey="_id" dataSource={adminData.rows} pagination={pagination} onChange={handleChange}  >
            <Column title="账号" dataIndex="username" key="name" width="200px" />
            {/* <Column title="密码" dataIndex="pwd" key="age" width="200px" /> */}
            <Column title="性别" dataIndex="gender" key="gender" width="200px" />
            <Column
                title="操作"
                width="200px"
                key="action"
                render={(text, record) => (
                    <Space size="middle">
                        <Button type="primary" onClick={() => { showModal(record._id) }} >
                            修改
                        </Button>
                        <Button type="primary" onClick={() => handleDel(record._id)} danger>
                            删除
                        </Button>
                    </Space>
                )}
            />
        </Table >
    )
}


